<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no" />
    <!--<meta http-equiv="Access-Control-Allow-Origin" content="*">-->
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>线下商家入驻</title>
    <link rel="stylesheet" href="../css/base.css">
    <!--<link rel="stylesheet" href="../css/globle.css">-->
    <link rel="stylesheet" href="../css/merchantEntry.css">
    <link rel="stylesheet" href="../css/personal/mobileSelect.css">
    <script src="../js/jquery-2.2.3.min.js"></script>
    <script src="../js/rem.js"></script>
    <script src="../js/common.js"></script>
    <script src="../js/person/mobileSelect.min.js"></script>
    <script src="../js/person/city.js"></script>
</head>

<body style="background-color: #F5F5F5">
<div id="app">
    <div class="head">
        <div class="h-left" onclick="window.history.go(-1)"></div>
        <div class="h-middle">商家入驻</div>
        <div class="h-right"></div>
    </div>
    <div style="height: .44rem;"></div>
    <!--<div class="navBox">-->
        <!--<div class="navTab">-->
            <!--<div class="nav-item xianup" onclick="location.href='shangjiaruzhuxianshang.html'">线上商家</div>-->
            <!--<div class="nav-item xiandown navActive">线下商家</div>-->
        <!--</div>-->
    <!--</div>-->

    <form id="add_news1"  >
        <p class="notes">请填写您的商家信息</p>
        <div class="container">
            <div class="cont">
                <div class="c-left">
                    公司所在地
                </div>
                <div class="c-right">
                    <p id="area2">河北省 北京市 东城区</p>
                    <input type="hidden" name="area_id1" id="area_id1">
                    <input type="hidden" name="area_id2" id="area_id2">
                    <input type="hidden" name="area_id3" id="area_id3">
                    <img src="../img/icon-right.png" style="margin-top: -.16rem" alt="">
                </div>
            </div>
            <div class="cont" style="line-height: 0.2rem;">
                <div class="c-left">
                    申请是否为法人
                </div>
                <div class="c-right" style=" color: #262626;">
                    <input type="radio" id="awesome" name="faren" class="yes faren"/>
                    <label for="awesome">是</label>
                    <input type="radio" id="awesome2" name="faren" class="no faren"/>
                    <label for="awesome2">否</label>
                </div>
            </div>
            <div class="cont" style="border-bottom: 0">
                <div class="c-left">
                    法人姓名
                </div>
                <div class="c-right">
                    <input type="text" name="cardId" id="legalPerson" placeholder="请输入法人姓名" value="" class="c-inp c-inp-number">
                </div>
            </div>
            <div class="cont" style="border-bottom: 0">
                <div class="c-left">
                    身份证号
                </div>
                <div class="c-right">
                    <input type="text" name="cardId" placeholder="请输入身份证号码" value="" id="iDnumber" class="c-inp c-inp-number">
                </div>
            </div>
            <div class="cont" style="border-bottom: 0">
                <div class="c-left">
                    公司名称
                </div>
                <div class="c-right">
                    <input type="text" name="cardId" id="companyName" placeholder="请输入公司名称" value="" class="c-inp c-inp-number">
                </div>
            </div>
            <div class="cont" style="border-bottom: 0">
                <div class="c-left">
                    推荐人姓名
                </div>
                <div class="c-right">
                    <input type="text" name="cardId" id="tuiName" placeholder="请输入推荐人姓名" value="" class="c-inp c-inp-number">
                </div>
            </div>
            <div class="cont" style="border-bottom: 0">
                <div class="c-left">
                    公司行业
                </div>
                <div class="c-right">
                    <select class="selectcn c-n-inp" type="text" id="cn-type" name="cn-type">

                    </select>
                    <img src="../img/icon-right.png" alt="">
                </div>
            </div>
        </div>
        <p class="notes">
            上传证件照
            <span>(拍摄法人手持第二代身份证照片,请确保图片清晰）</span>
        </p>
        <div class="container">
            <input type="hidden" value="" id="frontview">
            <input type="file" hidden onchange="asd()"  name="upcardUrl" id="upfileElem" value="正面" >
            <img src="../img/shenfenzheng.png" class="sfzImg" id="upfileSelect" alt="">
            <p class="sfz-p">手持证件照</p>
        </div>

    </form>
    <!--<p class="notes">-->
    <!--上传证件照-->
    <!--<span>(拍摄法人手持第二代身份证照片,请确保图片清晰）</span>-->
    <!--</p>-->
    <!--<div class="container">-->
    <!--<img src="../img/shenfenzheng.png" class="sfzImg" alt="">-->
    <!--<p class="sfz-p">手持证件照</p>-->
    <!--</div>-->
    <form id="add_news"  >
        <p class="notes">请填写您的店铺信息</p>
        <div class="container">
            <div class="cont">
                <input type="hidden" value="" id="logoview">
                <div class="logo">
                    <img src="../img/shenfenzheng.png" style="width: 100%;height: 100%;float: left;" id="logofileSelect" alt="">
                </div>
                <input type="file" hidden onchange="fgh()"  name="upcardUrl" id="logofileElem" value="logo" >
                <p class="logo-p">
                    上传店铺logo <span>(尺寸宽高比例1:1)</span>
                </p>
                <div class="container">
                </div>
            </div>
            <div class="cont">
                <div class="c-left">
                    店铺名称
                </div>
                <div class="c-right">
                    <input type="text" name="realName" value="" id="shopName"  placeholder="请输入店铺名称" class="c-inp c-inp-username">
                    <img src="../img/icon-right.png" alt="">
                </div>
            </div>
            <div class="cont">
                <div class="c-left">
                    经营电话
                </div>
                <div class="c-right" style="color: #262626;">
                    <input type="text" name="cardId" id="telephone" placeholder="请输入经营电话" value="" class="c-inp c-inp-number">
                </div>
            </div>
            <div class="cont">
                <div class="c-left">
                    经营地址
                </div>
                <div class="c-right">
                    <input type="text" name="realName" value="" id="address"  placeholder="请输入经营地址" class="c-inp c-inp-username">
                    <img src="../img/icon-right.png" alt="">
                </div>
            </div>
            <div class="cont">
                <div class="c-left">
                    经营执照号
                </div>
                <div class="c-right" style="color: #262626;">
                    <input type="text" name="cardId" placeholder="请输入经营执照号" value="" id="licenseNo" class="c-inp c-inp-number">
                </div>
            </div>
        </div>
        <p class="notes">
            上传营业执照
            <span>(请确保图片清晰）</span>
        </p>
        <div class="container">
            <input type="hidden" value="" id="backview">
            <input type="file" hidden onchange="zxc()"  name="upcardUrl" id="backfileElem" value="back" >
            <img src="../img/shenfenzheng.png" class="sfzImg" id="downfileSelect" alt="">
            <p class="sfz-p">营业执照</p>
        </div>
    </form>
    <div class="submit" onclick="fff()" style="margin-bottom: .3rem">提交认证</div>
</div>

</body>
<script>

    var upfileSelect = document.getElementById("upfileSelect"),
        upfileElem = document.getElementById("upfileElem");

    // 正面身份证照片
    upfileSelect.addEventListener("click", function (e) {
        if (upfileElem) {
            upfileElem.click();
        }
        e.preventDefault(); // prevent navigation to "#"
    }, false);
    //提交正面的图片
    function  asd() {
        var formData = new FormData();
        formData.append('file',upfileElem.files[0]);
        console.log(formData.get('file'));
        $.ajax({
            url: SURL+'/jfd/upload/pictureUpload',
            type: 'post',
            data:formData,
            cache: false,
            processData: false,
            contentType: false,
            success: function (res) {
                console.log(res,'z上传成功');
                $('#frontview').val(res.data.url);
                $('#upfileSelect').attr('src',res.data.url);
                console.log($('#frontview').val())
            }
        })
    }

    // logo
    var downfileSelect = document.getElementById("logofileSelect"),
        downfileElem = document.getElementById("logofileElem");

    downfileSelect.addEventListener("click", function (e) {
        if (downfileElem) {
            downfileElem.click();
        }
        e.preventDefault(); // prevent navigation to "#"
    }, false);
    //提交logo的图片
    function  fgh() {
        var formData = new FormData();
        formData.append('file',downfileElem.files[0]);
        console.log(downfileElem.files[0]);
        $.ajax({
            url: SURL+'/jfd/upload/pictureUpload',
            type: 'post',
            data:formData,
            cache: false,
            processData: false,
            contentType: false,
            success: function (res) {
                console.log(res,'f上传成功');
                $('#logoview').val(res.data.url);
                $('#logofileSelect').attr('src',res.data.url);
            }
        })
    }
    // 营业执照
    var yingfileSelect = document.getElementById("downfileSelect"),
        yingfileElem = document.getElementById("backfileElem");

    yingfileSelect.addEventListener("click", function (e) {
        if (yingfileElem) {
            yingfileElem.click();
        }
        e.preventDefault(); // prevent navigation to "#"
    }, false);
    //提交logo的图片
    function  zxc() {
        var formData = new FormData();
        formData.append('file',yingfileElem.files[0]);
        console.log(yingfileElem.files[0]);
        $.ajax({
            url: SURL+'/jfd/upload/pictureUpload',
            type: 'post',
            data:formData,
            cache: false,
            processData: false,
            contentType: false,
            success: function (res) {
                console.log(res,'f上传成功');
                $('#backview').val(res.data.url);
                $('#downfileSelect').attr('src',res.data.url);
            }
        })
    }
    $.ajax({
        url: SURL + '/jfd/shopIndustry/list',
        type: 'post',
        success: res => {
            // console.log(res)
            res.forEach(element => {
                $('.selectcn').append(
                    `
                    <option value="${element.hyId}" id="${element.hyId}">${element.hyName}</option>
                    `
                )
            });
        }
    })
    $.ajax({
        url: SURL+ '/jfd/shopApprove/application',
        type: 'post',
        data: {
            userId:localStorage.getItem('userId')
        },
        dataType: 'JSON',
        success: function (res) {
            console.log(res);
            if(res.code == -3) {

            }else {
                if(res.shopApprove1.shopStatus==1){
                    $('#area2').text(res.address)
                    $('#upfileSelect').attr('src',res.shopApprove1.legalPersonImg)
                    $('#logofileSelect').attr('src',res.shopApprove1.logo);//店铺logo
                    $('#downfileSelect').attr('src',res.shopApprove1.licenseImg)
                    $('#legalPerson').val(res.shopApprove1.legalPerson);//法人姓名
                    $('#iDnumber').val(res.shopApprove1.idnumber);//法人身份证号
                    $('#companyName').val(res.shopApprove1.companyName);//公司名称
                    $('#shopName').val(res.shopApprove1.shopName);//店铺名称
                    $('#telephone').val(res.shopApprove1.telephone);//经营电话
                    $('#address').val(res.shopApprove1.address);//经营地址
                    $('#licenseNo').val(res.shopApprove1.licenseNo);//营业执照号码
                    $('#cn-type').val(res.shopApprove1.industry);
                    $('#tuiName').val(res.shopApprove1.tuiName);
                }else{

                }
            }
        }
    })
    //提交后台 所有信息
    function fff(){
        if($('#awesome:checked').val()){
            var _num = 1;
        } else if ($('#awesome2:checked').val()) {
            var _num = 2;
        } else {
            alert('未选')
        }
        var logo = $('#logoview').val();//店铺logo
        var frontview = $('#frontview').val();//身份证url
        var backview = $('#backview').val();//营业执照
        var provinceId = $('#area_id1').val();//省
        var cityId = $('#area_id2').val();//市
        var areaId = $('#area_id3').val();//县
        var legalPerson = $('#legalPerson').val();//法人姓名
        var iDnumber = $('#iDnumber').val();//法人身份证号
        var companyName = $('#companyName').val();//公司名称
        var shopName = $('#shopName').val();//店铺名称
        var telephone = $('#telephone').val();//经营电话
        var address = $('#address').val();//经营地址
        var licenseNo = $('#licenseNo').val();//营业执照号码
        var isLegal = _num;
        var industry = $('#cn-type').val();
        var tuiName = $('#tuiName').val();

        // $(".no").attr("checked",true);
        var data = {
            userId: localStorage.getItem('userId'),
            legalPersonImg:frontview,
            licenseImg:backview,
            provinceId:provinceId,
            cityId: cityId,
            areaId: areaId,
            legalPerson:legalPerson,
            iDnumber:iDnumber,
            companyName:companyName,
            shopName:shopName,
            telephone:telephone,
            address:address,
            licenseNo:licenseNo,
            logo:logo,
            isLegal:isLegal,
            industry:industry,
            tuiName:tuiName
        }
        $.ajax({
            url: SURL+ '/jfd/storeApplys/offlineReviewButton',
            type: 'post',
            data: data,
            dataType: 'JSON',
            success: function (res) {
                alert(res.msg);
                window.location.href='shenqingjieguo.html'
            }
        })
    }
    $('#area2').click(function(){
        var mobileSelect = new MobileSelect({
            trigger: '#area2',
            title: '地区选择',
            wheels: [
                {data:city}
            ],
            keyMap: {
                id:'areaId',
                value: 'name',
                childs :'sub'
            },
            position:[2],
            callback:function(indexArr, data){
                console.log(data);
                for(var i=0,l=data.length;i<l;i++){
                    var areaid=i+1;
                    $('#area_id'+areaid).val(data[i].areaId);
                }
            }
        });
    })

</script>

</html>
